<template>
  <div class="main">
    <router-view></router-view>
    <nav-bar v-if="show"></nav-bar>
  </div>
</template>

<script setup>
import navBar from '@/components/navBar.vue'
import { useRouter } from 'vue-router';
import { reactive, ref } from 'vue'

const show = ref(false)

const state = reactive({
  menu: ['/home', '/menu', '/community', '/person', '/common', '/chatBot']
})

// 是否显示底部导航栏，取决于当前路由是否在菜单中
const router = useRouter()
router.beforeEach((to, from, next) => {
  show.value = state.menu.includes(to.path)
  next()
})

</script>

<style lang="less" scoped></style>